<template>
	<div>
		<el-select v-model="search.address" value-key="id" remote filterable placeholder="请搜索地址选择"
			@change="changeAddress" :remote-method="getAddress" size="medium">
			<el-option v-for="item in address_list" :key="item.id" :label="item.address" :value="item">
			</el-option>
		</el-select>
	</div>
</template>

<script>
	import API from '@/api/index.js'

	export default {
		name: "address-name",
		data() {
			return {
				search: {
					address: this.address_name
				},
				address_list: [],
			}
		},
		props: ['address_name'],
		watch: {
			address_name(val) {
				this.search.address = val;
			}
		},
		methods: {
			getAddress(val) {
				let self = this;
				self.search.address = val;
				API.searchAddresses([], 0, val).then(res => {
					let data = res.data.data;
					self.$notify({
						message: '搜索成功'
					});
					self.address_list = [];
					data.map(item => {
						self.address_list.push({
							id: item.id,
							address: item.address
						})
					})
					return self.address_list;
				}).catch(err => {
					self.$message.error(err.response.data.message);
				});
			},
			changeAddress(val) {
				let self = this;
				self.$emit('getAddress', {
					addressData: val
				})
			}
		}
	}
</script>

<style scoped>

</style>
